<template>
  <basic-container>
    <div class="meals">
      <div
        ref="layershipu"
        id="tooltip_shipu"
        class="el-popover el-popper el-popover--plain"
        style="
          display: none;
          width: 400px;
          position: absolute;
          top: 10px;
          left: 10px;
          z-index: 2064;
        "
        v-show="layershipu"
        tabindex="0"
        x-placement="bottom"
      >
        <div class="el-popover__title">{{ curentHoverFood.name }}</div>

        <showfoods-week
          :headers="showHeaders"
          :datas="showDatas"
          days="5"
          :title="title"
          ref="showChild"
        >
        </showfoods-week>
      </div>

      <div
        ref="foodmenudLayer"
        id="foodmenudLayer"
        class="el-popover el-popper el-popover--plain"
        style="
          display: none;
          width: 400px;
          position: absolute;
          top: 10px;
          left: 10px;
          z-index: 2064;
        "
        v-show="layershipu"
        tabindex="0"
        x-placement="bottom"
      >
        <nutrient :nutritionValue="nutritionValue"></nutrient>
      </div>
      <el-collapse-transition>
        <div v-show="topShow">
          <el-row :gutter="20" style="padding: 0px; margin-top: 5px">
            <el-col :span="24">
              <el-form :gutter="10" :inline="true" :model="formInline">
                <el-form-item>
                  <el-input
                    placeholder="请选择周期"
                    v-model="WeekInfo.WeekTtitle"
                    class="input-with-select"
                    style="width: 350px"
                    suffix-icon="el-icon-date"
                  >
                    <el-select
                      style="width: 120px"
                      v-model="WeekInfo.weekType"
                      slot="prepend"
                      value-key="请选择周期"
                      placeholder="周长设置"
                      @change="selectWeekType"
                    >
                      <el-option label="5天一周" value="5"></el-option>
                      <el-option label="6天一周" value="6"></el-option>
                      <el-option label="7天一周" value="7"></el-option>
                    </el-select>
                  </el-input>

                  <el-date-picker
                    v-model="WeekInfo.weekValue"
                    type="week"
                    format="yyyy-MM"
                    :picker-options="{ firstDayOfWeek: 1 }"
                    @focus="FixWeek"
                    placeholder="选择时间"
                    name="WeekSelect"
                    @change="SelectWeek1"
                    style="
                      width: 230px;
                      opacity: 0;
                      position: absolute;
                      left: 120px;
                      top: -10px;
                    "
                    clear-icon=""
                    ref="refweekSelect"
                  >
                  </el-date-picker>
                </el-form-item>
                <el-form-item label="餐谱名称">
                  <el-input
                    v-model="WeekInfo.Weekdetails"
                    style="width: 300px"
                  ></el-input>
                </el-form-item>
                <el-form-item label="选择人群">
                  <el-select
                    v-model="WeekInfo.crowd"
                    placeholder="选择人群"
                    class="crow-item"
                    @change="selectPeople"
                  >
                    <el-option
                      v-for="(item, index) in crowdData"
                      :label="item.peopleName"
                      :value="item.id"
                      :key="item.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-form>
            </el-col>
          </el-row>
          <el-divider></el-divider>

          <el-row :gutter="20">
            <el-col :span="24">
              <el-form :inline="true" :model="WeekInfo">
                <el-form-item label="餐点设置">
                  <el-checkbox-group
                    v-model="WeekInfo.foodCatalog"
                    @change="AppendFoodType"
                  >
                    <el-checkbox label="早餐" name="早餐"></el-checkbox>
                    <el-checkbox label="早点" name="早点"></el-checkbox>
                    <el-checkbox label="午餐" name="午餐"></el-checkbox>
                    <el-checkbox label="午点" name="午点"></el-checkbox>
                    <el-checkbox label="晚餐" name="晚餐"></el-checkbox>
                    <el-checkbox label="晚点" name="晚点"></el-checkbox>
                  </el-checkbox-group>
                </el-form-item>

                <el-form-item label="分享平台">
                  <el-switch v-model="WeekInfo.sharePlant"> </el-switch>
                </el-form-item>
                <el-form-item label="公示">
                  <el-switch v-model="WeekInfo.shareTell"> </el-switch>
                </el-form-item>
                <el-form-item label="收藏">
                  <el-switch v-model="WeekInfo.collection"> </el-switch>
                </el-form-item>
              </el-form>
            </el-col>
          </el-row>

          <el-divider></el-divider>
        </div>
      </el-collapse-transition>
      <el-row :gutter="20">
        <el-col :span="24">
          <el-form :gutter="10" :inline="true" :model="WeekInfo">
            <el-form-item>
              <el-button
                @click="wrapscan"
                style="margin-left: 10px"
                size="medium"
                type="primary"
                >智能配平
              </el-button>
              <el-button
                @click="buttonend"
                style="margin-left: 10px"
                size="medium"
                type="primary"
                >保存食谱
              </el-button>

              <el-button
                style="margin-left: 10px"
                size="medium"
                @click="dishClear"
                >清空
              </el-button>

              <el-button
                style="margin-left: 10px"
                size="medium"
                @click="allergy1()"
                v-if="tableData.length == 0"
                >过敏
              </el-button>
              <el-button
                style="margin-left: 10px"
                size="medium"
                @click="allergy1()"
                type="primary"
                v-if="tableData.length > 0"
                class="judegRed"
                >过敏
              </el-button>

              <el-popover placement="right" width="300" trigger="click">
                <div v-if="foodMutuals.length == 0"><p>无相克食材</p></div>
                <div
                  v-if="foodMutuals.length > 0"
                  v-for="(item, index) in foodMutuals"
                >
                  <p>{{ index + 1 }}、{{ item.msg }}</p>
                </div>
                <el-button
                  slot="reference"
                  style="margin-left: 10px"
                  size="medium"
                  v-if="foodMutuals.length == 0"
                >
                  不宜同食
                </el-button>
                <!--<button  slot="reference" > 不宜同食</button>-->
                <el-button
                  slot="reference"
                  style="margin-left: 10px;"
                  size="medium"
                  v-if="foodMutuals.length > 0"
                  class="judegRed"
                  type="primary"

                >
                  不宜同食
                </el-button>
              </el-popover>

              <el-popover placement="right" width="300" trigger="click">
                <nutrient-with-color
                  :nutrition="nutrition"
                  :WeekTtitle="WeekInfo.WeekTtitle"
                  :titleFlag="true"
                ></nutrient-with-color>
                <el-button
                  slot="reference"
                  style="margin-left: 10px"
                  size="medium"
                  ><img src="/img/baobiao.png" width="10px" /> 营养素
                </el-button>
              </el-popover>
              <el-button
                style="margin-left: 10px"
                size="medium"
                @click="openNutritionDialog"
                ><img src="/img/baobiao.png" width="10px" /> 带量食谱
              </el-button>
              <el-button
                style="margin-left: 10px"
                size="medium"
                @click="openNoNumRecipeDialog"
              >
                <img src="/img/baobiao.png" width="10px" /> 不带量食谱
              </el-button>
              <el-button type="text" @click="topShow = !topShow">{{
                topShow ? "收起" : "展开"
              }}</el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>

      <el-row
        :gutter="20"
        style="padding: 0px; margin-top: 0px"
        @mouseover="HidenFoodTips($event)"
        @mouseout="HidenFoodTips($event)"
      >
        <el-col :span="5">
          <el-card :class="[topShow ? 'box-car' : 'box-car1']" shadow="never">
            <div class="clearfix panel_head">
              <el-button-group>
                <el-button
                  size="small"
                  :class="{ showFoodListColor: !showFoodList }"
                  @click="showFoodList = false"
                  >食谱
                </el-button>
                <el-button
                  size="small"
                  :class="{ showFoodListColor: showFoodList }"
                  @click="showFoodList = true"
                  >菜品
                </el-button>
              </el-button-group>
            </div>

            <el-tabs
              v-show="!showFoodList"
              v-model="activeName"
              @mouseout="HidenFoodTips($event)"
            >
              <!--//分享食谱-->
              <el-tab-pane
                label="分享食谱"
                name="first"
                @mouseout="HidenFoodTips($event)"
              >
                <div style="margin-top: -5px; padding: 5px">
                  <el-input
                    size="small"
                    placeholder="请输入食谱名称"
                    v-model="recipeNameSharePub"
                    class="input-with-select"
                    @change="recipeNameShareSearchPub()"
                  >
                  </el-input>
                </div>
                <div
                  style="
                    font-size: 10px;
                    margin: 0 10px;
                    display: flex;
                    justify-content: space-around;
                  "
                >
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: recipeSelectPub == '1' }"
                    @click="recipeNameShareSearchPub('1')"
                    >全部
                  </el-link>
                  |
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: recipeSelectPub == '2' }"
                    @click="recipeNameShareSearchPub('2', 1)"
                    >推荐
                  </el-link>
                </div>

                <div style="margin-top: 5px; margin-bottom: 2px">
                  <!--<el-divider></el-divider>-->
                </div>
                <ul
                  class="foodWeekListHis"
                  :class="[topShow ? 'foodWeekListHis2' : 'foodWeekListHis1']"
                  @mouseout="HidenFoodTips($event)"
                  ref="boxScroll1"
                >
                  <li
                    v-for="f in mealListLeft"
                    :key="f.id"
                    style="font-size: 14px"

                  >
                    <span  @mouseover="ShowFood($event, f)"
                           @mouseout="HidenFoodTips($event)">{{ f.recipeName }}</span>
                    <img
                      style="width: 20px"
                      @click="mealLoad(f, f.recipeName)"
                      src="/img/arrow.png"
                      alt
                    />
                  </li>
                  <li v-show="recipefinishedPub" style="text-align: center">
                    无更多数据
                  </li>
                </ul>
              </el-tab-pane>
              <!--//个人食谱-->
              <el-tab-pane
                label="个人食谱"
                name="second"
                @mouseout="HidenFoodTips($event)"
              >
                <div style="margin-top: -5px; padding: 5px">
                  <el-input
                    size="small"
                    placeholder="请输入食谱名称"
                    v-model="recipeNameSharePri"
                    class="input-with-select"
                    @change="recipeNameShareSearchPri()"
                  >
                    <!--<el-button slot="append" icon="el-icon-search" @click="recipeNameShareSearchPri()"></el-button>-->
                  </el-input>
                </div>
                <div
                  style="
                    font-size: 10px;
                    margin: 0 10px;
                    display: flex;
                    justify-content: space-between;
                  "
                >
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: recipeSelectPri == '1' }"
                    @click="recipeNameShareSearchPri('1')"
                    >全部
                  </el-link>
                  |
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: recipeSelectPri == '2' }"
                    @click="recipeNameShareSearchPri('2', 0)"
                    >公开
                  </el-link>
                  |
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: recipeSelectPri == '3' }"
                    @click="recipeNameShareSearchPri('3', 1)"
                    >隐藏
                  </el-link>
                </div>

                <div style="margin-top: 5px; margin-bottom: 2px">
                  <!--<el-divider></el-divider>-->
                </div>

                <ul
                  ref="boxScroll2"
                  class="foodWeekListHis"
                  :class="[topShow ? 'foodWeekListHis2' : 'foodWeekListHis1']"
                  @mouseout="HidenFoodTips($event)"
                >
                  <li
                    v-for="f in peopleMealListLeft"
                    :key="f.id"

                    style="font-size: 14px"
                  >
                    <span  @mouseover="ShowFood($event, f)"
                           @mouseout="HidenFoodTips($event)">{{ f.recipeName }}</span>
                    <img
                      style="width: 20px"
                      @click="mealLoad(f, f.recipeName)"
                      src="/img/arrow.png"
                      alt
                    />
                  </li>
                  <li v-show="recipefinishedPri" style="text-align: center">
                    无更多数据
                  </li>
                </ul>
              </el-tab-pane>
            </el-tabs>

            <!--菜品-->
            <el-tabs
              v-show="showFoodList"
              v-model="activeName2"
              @mouseout="HidenFoodTips($event)"
            >
              <el-tab-pane label="公共菜品" name="thread">
                <div style="margin-top: -5px; padding: 5px">
                  <el-input
                    size="small"
                    placeholder="请输入菜品名称"
                    v-model="dishSharePub"
                    class="input-with-select"
                  >
                    <!--<el-button slot="append" icon="el-icon-search" ></el-button>-->
                  </el-input>
                </div>
                <div
                  style="
                    font-size: 10px;
                    margin: 0 15px;
                    display: flex;
                    justify-content: space-between;
                  "
                >
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: dishSelectPub == '1' }"
                    @click="dishShareSearchPub('1')"
                    >全部
                  </el-link>
                  |
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: dishSelectPub == '2' }"
                    @click="dishShareSearchPub('2', 0)"
                    >常用
                  </el-link>
                </div>

                <div style="margin-top: 5px; margin-bottom: 2px">
                  <!--<el-divider></el-divider>-->
                </div>

                <el-tree
                  class="filter-tree"
                  :data="menuDishList"
                  :props="defaultProps"
                  ref="dishTreePub"
                  :filter-node-method="filterNodePub"
                  draggable
                  :accordion="true"
                  @node-drag-start="foodmenueDragStart"
                  :allow-drop="foodmenueDragEnd"
                  @node-drag-over="foodmenueDragMove"
                >
                </el-tree>
              </el-tab-pane>
              <el-tab-pane label="个人菜品" name="four">
                <div style="margin-top: -5px; padding: 5px">
                  <el-input
                    size="small"
                    placeholder="请输入菜品名称"
                    v-model="dishSharePri"
                    class="input-with-select"
                  >
                    <!--<el-button slot="append" icon="el-icon-search"></el-button>-->
                  </el-input>
                </div>
                <div
                  style="
                    font-size: 10px;
                    margin: 0 15px;
                    display: flex;
                    justify-content: space-between;
                  "
                >
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: dishSelectPri == '1' }"
                    @click="dishShareSearchPri('1', 2)"
                    >全部
                  </el-link>
                  |
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: dishSelectPri == '2' }"
                    @click="dishShareSearchPri('2', 0)"
                    >公开
                  </el-link>
                  |
                  <el-link
                    :underline="false"
                    :class="{ recipeColor: dishSelectPri == '3' }"
                    @click="dishShareSearchPri('3', 1)"
                    >隐藏
                  </el-link>
                </div>
                <div class="select-item">
                  <el-cascader
                    size="mini"
                    :options="belongRegionOption"
                    style="width: 100px"
                    v-model="belongRegion"
                    @change="dishShareSearchPri()"
                    :props="{
                      checkStrictly: true,
                      label: 'name',
                      value: 'code',
                    }"
                    clearable
                  ></el-cascader>
                  <el-select
                    size="mini"
                    v-model="seasonl"
                    clearable
                    style="width: 60px"
                    placeholder="请选择"
                    @change="dishShareSearchPri()"
                  >
                    <el-option
                      v-for="item in seasonlOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                  <el-select
                    size="mini"
                    v-model="isUse"
                    clearable
                    style="width: 70px"
                    placeholder="请选择"
                    @change="dishShareSearchPri()"
                  >
                    <el-option
                      v-for="item in isUseOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </div>

                <div style="margin-top: 5px; margin-bottom: 2px">
                  <!--<el-divider></el-divider>-->
                </div>
                <el-tree
                  class="filter-tree"
                  :data="personMenuDishList"
                  :props="defaultProps"
                  ref="dishTreePri"
                  :filter-node-method="filterNodePri"
                  draggable
                  :accordion="true"
                  @node-drag-start="foodmenueDragStart"
                  :allow-drop="foodmenueDragEnd"
                  @node-drag-over="foodmenueDragMove"
                >
                </el-tree>
              </el-tab-pane>
            </el-tabs>
          </el-card>
        </el-col>
        <el-col :span="19">
          <div   v-loading="loading"  element-loading-text="您的食谱正在配置中，请耐心等待"
                 class="foodPanel"
            @mouseout="HidenFoodTips($event)"
            @mouseover="HidenFoodTips($event)"
          >
            <foods-week
              @childfn="parentFn"
              @jundgeFood="jundgeFood"
              @allergy="allergy"
              :headers="headers"
              :datas="datas"
              days="5"
              :score="score"
              :crowd="WeekInfo.crowd"
              :dragnode="drogNode"
              ref="child"
              :foodCatalog="WeekInfo.foodCatalog"
              :foodMutuals="foodMutuals"
              :topShow="topShow"
            >
            </foods-week>
          </div>
        </el-col>
      </el-row>
      <div id="df" class="scores">
        <div v-if="parseFloat(score) >= 90" class="scores-same scores-youxiu">
          <div class="scores3">
            <p class="gnus" @click="tfractio">
              {{ (score+"").split(".")[0] }}<span class="gnus-fen">.{{ (score+"").split(".")[1] }}分</span>
            </p>
          </div>
        </div>
        <div
          v-if="parseFloat(score) < 90 && parseFloat(score) >= 85"
          class="scores-same scores-hege"
        >
          <div class="scores3">
            <p class="gnus" @click="tfractio">
              {{ (score+"").split(".")[0]  }} <span class="gnus-fen">.{{ (score+"").split(".")[1] }}分</span>
            </p>
          </div>
        </div>
        <div v-if="parseFloat(score) < 85" class="scores-same scores-buhege">
          <div class="scores3" style="color: #dd6161">
            <p class="gnus" @click="tfractio" v-if="parseFloat(score)==0">
              {{  (score+"").split(".")[0]  }}<span class="gnus-fen" style="color: #dd6161">{{ (score+"").split(".")[1] }}分</span>
            </p>
            <p class="gnus" @click="tfractio" v-if="parseFloat(score)>0">
              {{  (score+"").split(".")[0]  }}<span class="gnus-fen" style="color: #dd6161">.{{ (score+"").split(".")[1] }}分</span>
            </p>
          </div>
          <!--<div class="scores2">-->
          <!--<p class="gnus-fen" style="color: #dd6161; margin-top: 35px">-->
          <!--<span>离</span><span class="gnus-hege">合格</span>-->
          <!--<br />-->
          <!--<span class="gnus-fen" style="color: #dd6161"-->
          <!--&gt;需提升{{ (85 - score).toFixed(2) }}分！</span-->
          <!--&gt;-->
          <!--</p>-->
          <!--</div>-->
        </div>
      </div>
      <!-- 分数弹框 -->
      <el-drawer
        title="我是标题"
        id="drawerid"
        :modal-append-to-body="false"
        :visible.sync="drawer"
        :with-header="false"
      >
        <show-score
          :intake="intake"
          :nutrition="nutrition"
          :power="power"
          :meal="meal"
          :protein="protein"
          :tenantName="tenantName"
          :startTime="startTimeStr"
          :endTime="endTimeStr"
          :score="score"
        ></show-score>
      </el-drawer>
      <!-- 分数弹框 结束-->
      <nutrition :WeekInfo="WeekInfo" ref="nutritionChild" />
      <!-- 智能配平弹框 -->
      <el-dialog
        title="食谱配平"
        append-to-body
        :fullscreen="true"
        :visible.sync="pointscan"
        width="600px"
      >
        <div class="header">
          <div class="headerTime">
            <span class="demonstration" style="padding-right: 20px"
              >日期：{{ startTimeStr }}-{{ endTimeStr }}</span
            >

            <el-radio v-model="foodRadio" label="1">调整食材的量</el-radio>
          </div>
          <div class="nutrition">
            <span style="margin-right: 20px">选择营养素</span>
            <el-select
              v-model="node.nowCode"
              placeholder="请选择"
              @change="ncodeChange"
            >
              <el-option
                v-for="item in nutritionValue"
                :key="item.code"
                :label="item.name"
                :value="item.code"
              >
              </el-option>
            </el-select>
            <span style="padding-right: 10px; padding-left: 30px"
              >起始值(%)</span
            >
            <el-input
              disabled
              style="width: 140px"
              placeholder="请输入内容"
              v-model="node.nowValue"
              clearable
            >
            </el-input>
            ~
            <span style="padding-right: 10px; padding-left: 10px"
              >期望值(%)</span
            >
            <el-input-number
              v-model="node.exceptValue"
              controls-position="right"
            ></el-input-number>
            <!--<el-input-->
            <!--style="width: 140px"-->
            <!--placeholder="请输入内容"-->
            <!--v-model="node.exceptValue"-->
            <!--clearable-->
            <!--&gt;-->
            <!--</el-input>-->

            <el-button
              style="margin-left: 30px"
              type="primary"
              @click="startTrim"
              >开始配平
            </el-button>
            <el-button type="primary" @click="application">应用</el-button>
            <el-button type="primary" @click="resetMeals">重置</el-button>
          </div>
        </div>
        <!-- 表格 -->
        <div class="onblur">
          <nutrient-with-color :nutrition="nutrition"></nutrient-with-color>

          <smartfoods-week
            @childfn="parentFn"
            :headers="headers"
            :smartDatas="smartDatas"
            days="5"
            :crowd="WeekInfo.crowd"
            :dragnode="drogNode"
            :nutritionValue="nutritionValue"
            :peipScore="peipScore"
            :foodCatalog="WeekInfo.foodCatalog"
            ref="child2"
          ></smartfoods-week>
        </div>

        <div class="scores">
          <div
            v-if="parseFloat(peipScore) >= 90"
            class="scores-same scores-youxiu"
          >
            <div class="scores3">
              <p class="gnus">
                {{ (peipScore+"").split(".")[0] }}<span class="gnus-fen">.{{ (peipScore+"").split(".")[1] }}分</span>
              </p>
            </div>
          </div>
          <div
            v-if="parseFloat(peipScore) < 90 && parseFloat(peipScore) >= 85"
            class="scores-same scores-hege"
          >
            <div class="scores3">
              <p class="gnus">
                {{ (peipScore+"").split(".")[0] }}<span class="gnus-fen">.{{ (peipScore+"").split(".")[1] }}分</span>
              </p>
            </div>
          </div>
          <div
            v-if="parseFloat(peipScore) < 85"
            class="scores-same scores-buhege"
          >
            <div class="scores3" style="color: #dd6161">
              <p class="gnus" v-if="parseFloat(peipScore)==0">
                {{ (peipScore+"").split(".")[0] }}<span class="gnus-fen" style="color: #dd6161">{{ (peipScore+"").split(".")[1] }}分</span>
              </p>
              <p class="gnus" v-if="parseFloat(peipScore)>0">
                {{ (peipScore+"").split(".")[0] }}<span class="gnus-fen" style="color: #dd6161">.{{ (peipScore+"").split(".")[1] }}分</span>
              </p>
            </div>
            <!--<div class="scores2">-->
            <!--<p class="gnus-fen" style="color: #dd6161; margin-top: 35px">-->
            <!--<span>离</span><span class="gnus-hege">合格</span>-->
            <!--<br />-->
            <!--<span class="gnus-fen" style="color: #dd6161"-->
            <!--&gt;需提升{{ (85 - score).toFixed(2) }}分！</span-->
            <!--&gt;-->
            <!--</p>-->
            <!--</div>-->
          </div>
        </div>
      </el-dialog>
      <!-- 智能配平弹框结束 -->

      <!--过敏-->
      <el-dialog
        title="食物过敏"
        append-to-body
        :visible.sync="jundgeallergy"
        :close-on-click-modal="false"
      >
        <div class="item-allergy">
          <el-table
            :span-method="objectSpanMethod"
            :data="tableData"
            border
            style="width: 100%; margin-top: 20px"
          >
            <el-table-column prop="className" label="班级" width="180">
            </el-table-column>
            <el-table-column prop="studentName" label="姓名"> </el-table-column>
            <el-table-column prop="dishName" label="菜品"> </el-table-column>
            <el-table-column prop="foodName" label="食材"> </el-table-column>
            <el-table-column prop="symptom" label="过敏症状"> </el-table-column>
          </el-table>
        </div>

        <div slot="footer" class="dialog-footer">
          <el-button @click="jundgeallergy = false" type="primary"
            >确 定</el-button
          >
        </div>
      </el-dialog>
      <noNumRecipe
        :datas="datas"
        :recipeDay="WeekInfo.weekType"
        ref="children2"
      >
      </noNumRecipe>
    </div>
  </basic-container>
</template>


<script>
import { debounce } from "@/util/debouncearg";
import { formateDate } from "@/api/tool/date";
import nutrition from "@/views/recipeManager/nutrition.vue";
import noNumRecipe from "@/views/recipeManager/noNumRecipe.vue";
import foodsWeek from "@/views/foods/components/foodsweek";
import showfoodsWeek from "@/views/foods/components/showfoodsweek";
import { getList } from "@/api/system/special";
import {
  mealList,
  getDishByBaseId,
  dishDetail,
  save,
  detail,
  update,
  grantTree,
  jundgeFood,
  jundgeAllergy,
} from "@/api/system/meals";
import nutrient from "@/views/foods/components/nutrient";
import nutrientWithColor from "@/views/foods/components/nutrientwithcolor";
import showScore from "@/views/foods/components/showscore";
import smartfoodsWeek from "@/views/foods/components/smartfoodsweek";
import { detailByPeopleId } from "@/api/system/special";

export default {
  components: {
    foodsWeek,
    showfoodsWeek,
    nutrient,
    nutrientWithColor,
    showScore,
    smartfoodsWeek,
    nutrition,
    noNumRecipe,
  },
  mounted() {
    this.$nextTick(() => {
      this.$refs.boxScroll1.addEventListener("scroll", this.getData);
      this.$refs.boxScroll2.addEventListener("scroll", this.getData2);
    });

    this.initData();
    this.dragFunc("df");
  },
  created() {
    //this.init();
    var that = this;
    document.body.ondrop = function (event) {
      event.preventDefault();
      event.stopPropagation();
    };
    document.oncontextmenu = function () {
      return false;
    };
  },
  data() {
    const data = [];
    return {
      loading:false,
      topShow: true,
      tableData: [],
      jundgeallergy: false, //过敏
      foodRadio: "1",
      isUse: undefined,
      currentPub: 1,
      sizePub: 20,
      currentPri: 1,
      sizePri: 20,
      belongRegion: undefined,
      seasonl: undefined,
      belongRegionOption: [],
      seasonlOptions: [
        {
          label: "春",
          value: "1",
        },
        {
          label: "夏",
          value: "2",
        },
        {
          label: "秋",
          value: "3",
        },
        {
          label: "冬",
          value: "4",
        },
      ],
      isUseOptions: [
        {
          label: "常用",
          value: 0,
        },
        {
          label: "不常用",
          value: 1,
        },
      ],
      recipeNameSharePub: "",
      recipeNameSharePri: "",
      dishSharePri: "",
      dishSharePub: "",
      id: "",

      score: "0", //配餐分数
      pcScore: "0", //配餐保存的分数
      peipScore: "0", //配平分数
      peippcScore: "0", //配平保存的分数
      intake: {},
      nutrition: [],
      power: [],
      meal: [],
      tenantName: "",
      protein: [],
      drawer: false, //分数弹框
      pointscan: false, //智能配餐弹框
      secondary: [
        {
          id: 3,
          date: "蛋白质",
          name: "322",
          address: "123.91",
          children: [
            {
              id: 31,
              date: "完全蛋白质",
              name: "233",
              address: "94",
            },
            {
              id: 32,
              date: "半完全蛋白质",
              name: "234",
              address: "94",
            },
          ],
        },
      ],
      types: "", //餐点
      WeekInfo: {
        shareTell: false,
        collection: false,
        sharePlant: false,
        weekType: "5", //周期类型
        WeekTtitle: "", //周期标题
        Weekdetails: "", //周期明细
        weekValue: "",
        foodCatalog: [], //餐点类型
        crowd: "", //人群
        shareOrg: true,
        showFoodCatalog: "", //餐点类型
      },
      activeName: "first",
      activeName2: "thread",
      // 表格头部
      headers: [],
      showHeaders: [],
      // 表格数据
      datas: [],
      smartDatas: [],
      showDatas: [],
      title: "",
      WeekList: [], //所选的时间周期
      showWeekList: [],
      FoodTypeList: [], //所选餐点类型
      rebuild: false,
      showFoodList: false,
      recipeSelectPub: "1",
      recipeSelectPri: "1",
      recipeSelect: "1",
      dishSelectPub: "1",
      dishSelectPri: "1",
      personMenuDishList: [],
      menuDishList: [
        {
          id: 1,
          label: "番茄鸡蛋",
          node: {
            id: 102,
            name: "番茄鸡蛋",
            count: 1,
            children: [
              { id: 101001, name: "绿豆", count: 1 },
              { id: 101002, name: "白糖", count: 1 },
            ],
          },
        },
        {
          id: 2,
          label: "绿豆粥",
          node: {
            id: 103,
            name: "绿豆粥",
            count: 1,
            children: [
              { id: 101001, name: "绿豆", count: 1 },
              { id: 101002, name: "白糖", count: 1 },
            ],
          },
        },
      ],
      ncode: "101",

      nutritionValue: [
        {
          name: "能量",
          code: "101",
          value: "0",
          bz: "80%-120%",
          min: 80,
          max: 120,
        },
        {
          name: "蛋白质",
          code: "102",
          value: "0",
          bz: "80%-150%",
          min: 80,
          max: 150,
        },
        {
          name: "钙",
          code: "201",
          value: "0",
          bz: "80%-160%",
          min: 80,
          max: 160,
        },
        {
          name: "纳",
          code: "204",
          value: "0",
          bz: "80%-135%",
          min: 80,
          max: 135,
        },
        {
          name: "铁",
          code: "301",
          value: "0",
          bz: "80%-160%",
          min: 80,
          max: 160,
        },
        {
          name: "锌",
          code: "303",
          value: "0",
          bz: "80%-160%",
          min: 80,
          max: 160,
        },
        {
          name: "维生素A",
          code: "401",
          value: "0",
          bz: "80%-180%",
          min: 80,
          max: 180,
        },
        {
          name: "维生素B1",
          code: "405",
          value: "0",
          bz: "80%-250%",
          min: 80,
          max: 250,
        },
        {
          name: "维生素B2",
          code: "406",
          value: "0",
          bz: "80%-250%",
          min: 80,
          max: 250,
        },
        {
          name: "维生素C",
          code: "415",
          value: "0",
          bz: "80%-250%",
          min: 80,
          max: 250,
        },
      ],
      foodMutuals: [],
      node: {
        nowCode: "101",
        nowValue: "",
        exceptValue: undefined,
      },
      mealListLeft: [
        // {name:"周一食谱",id:"1"},
        // {name:"周二食谱",id:"2"},
        // {name:"周三食谱",id:"3"},
        // {name:"周四食谱",id:"4"}
      ],
      peopleMealListLeft: [],
      recipefinishedPub: false,
      recipefinishedPri: false,
      curentHoverFood: {},
      //拖动的节点
      drogNode: {},
      //是否正在拖拽节点
      drogNodeStats: false,
      year: "",
      month: "",
      startTime: "",
      startTimeStr: "",
      endTime: "",
      endTimeStr: "",
      mealTypeData: [
        {
          name: "早餐",
          value: "1",
        },
        {
          name: "早点",
          value: "2",
        },
        {
          name: "午餐",
          value: "3",
        },
        {
          name: "午点",
          value: "4",
        },
        {
          name: "晚餐",
          value: "5",
        },
        {
          name: "晚点",
          value: "6",
        },
      ],
    };
  },
  beforeMount() {},
  watch: {
    dishSharePub(val) {
      this.$refs.dishTreePub.filter(val);
    },
    dishSharePri(val) {
      this.$refs.dishTreePri.filter(val);
    },
  },
  methods: {
    getData2() {
      var boxScrollHeight = this.$refs.boxScroll2.scrollHeight;
      var boxScrollTop = this.$refs.boxScroll2.scrollTop;
      var boxClientHeight = this.$refs.boxScroll2.clientHeight;
      console.log(
        boxScrollHeight,
        boxScrollTop,
        boxClientHeight,
        boxScrollHeight - (boxScrollTop + boxClientHeight)
      );
      if (boxScrollHeight - (boxScrollTop + boxClientHeight) < 10) {
        this.ScrollUp2();
      }
    },
    ScrollUp2: function () {
      let that = this;
      if (!this.timer) {
        console.log("timer");
        this.timer1 = setTimeout(() => {
          if (this.recipefinishedPri) {
            return;
          }
          let isPub;
          if (this.recipeSelectPri == "2") {
            isPub = "0";
          }
          if (this.recipeSelectPri == "3") {
            isPub = "1";
          }
          mealList(
            2,
            isPub,
            this.recipeNameSharePri,
            undefined,
            1,
            undefined,
            ++this.currentPri,
            this.sizePri
          ).then((res) => {
            res.data.data.records.forEach((_) => {
              that.peopleMealListLeft.push(_);
            });
            if (that.peopleMealListLeft.length == res.data.data.total) {
              that.recipefinishedPri = true;
            }
          });
          this.timer1 = null;
        }, 1000);
      }
    },
    getData() {
      var boxScrollHeight = this.$refs.boxScroll1.scrollHeight;
      var boxScrollTop = this.$refs.boxScroll1.scrollTop;
      var boxClientHeight = this.$refs.boxScroll1.clientHeight;
      console.log(
        boxScrollHeight,
        boxScrollTop,
        boxClientHeight,
        boxScrollHeight - (boxScrollTop + boxClientHeight)
      );
      console.log(boxScrollHeight)
      console.log(boxScrollTop)
      console.log(boxClientHeight)
      if (boxScrollHeight - (boxScrollTop + boxClientHeight) < 10) {
        this.ScrollUp();
      }
    },
    ScrollUp: function () {
      let that = this;
      if (!this.timer) {
        console.log("timer");
        this.timer = setTimeout(() => {
          //  console.log("scrollUp");
          if (this.recipefinishedPub) {
            return;
          }
          let isRecommend;
          if (this.recipeSelectPub == "2") {
            isRecommend = "1";
          }
          mealList(
            1,
            undefined,
            this.recipeNameSharePub,
            undefined,
            1,
            isRecommend,
            ++this.currentPub,
            this.sizePub
          ).then((res) => {
            res.data.data.records.forEach((_) => {
              that.mealListLeft.push(_);
            });
            if (that.mealListLeft.length == res.data.data.total) {
              that.recipefinishedPub = true;
            }
          });
          this.timer = null;
        }, 1000);
      }
    },
    filterNodePri(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    filterNodePub(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    openNoNumRecipeDialog() {
      this.$refs.children2.openDialogVisible();
    },
    //打开带量食谱弹出框
    openNutritionDialog() {
      var foods = this.getNutritionData();
      this.$refs.nutritionChild.openNutritionDialog(foods);
    },
    //获取带量食谱数据
    getNutritionData() {
      let day = [0, 0, 0, 0, 0, 0, 0];
      let days = 0;
      let foods = {};
      let weekNum = {
        week1: 1,
        week2: 2,
        week3: 3,
        week4: 4,
        week5: 5,
        week6: 6,
        week7: 7,
      };

      foods.peopleId = this.WeekInfo.crowd;
      foods.recipeDay = this.WeekInfo.weekType;
      foods.connctVos = [];

      function sum(arr) {
        var len = arr.length;
        if (len == 0) {
          return 0;
        } else if (len == 1) {
          return arr[0];
        } else {
          return arr[0] + sum(arr.slice(1));
        }
      }

      this.datas.forEach((_) => {
        _.weeks.forEach((__) => {
          __.foods.forEach((___) => {
            let mealTypes = {};
            mealTypes.dishName = ___.name; //菜品名称
            mealTypes.week = weekNum[__.name].toString(); //星期几
            mealTypes.mealType = this.getmealTypeData(_.name); //餐点类型
            mealTypes.recipevals = []; //食材信息
            day[weekNum[__.name]] = 1;
            ___.children.forEach((____) => {
              let foodsObj = {};
              foodsObj.foodName = ____.name; //食材名称
              foodsObj.foodId = ____.id; //食材ID
              foodsObj.val = ____.count; //餐点类型
              foodsObj.mealType = this.getmealTypeData(_.name); //餐点类型
              foodsObj.week = weekNum[__.name]; //星期几
              mealTypes.recipevals.push(foodsObj);
            });
            foods.connctVos.push(mealTypes);
          });
        });
      });
      foods.days = sum(day);
      return foods;
    },
    dragFunc(id) {
      var Drag = document.getElementById(id);
      Drag.onmousedown = function (event) {
        var ev = event || window.event;
        event.stopPropagation();
        var disX = ev.clientX - Drag.offsetLeft;
        var disY = ev.clientY - Drag.offsetTop;
        document.onmousemove = function (event) {
          var ev = event || window.event;
          Drag.style.left = ev.clientX - disX + "px";
          Drag.style.top = ev.clientY - disY + "px";
          Drag.style.cursor = "move";
        };
      };
      Drag.onmouseup = function () {
        document.onmousemove = null;
        this.style.cursor = "default";
      };
    },

    selectPeople() {
      this.mealsTypeById();
    },
    //选择人群  修改日期信息
    mealsTypeById() {
      var that = this;
      detailByPeopleId(this.WeekInfo.crowd).then((res) => {
        let arr = [];
        if (res.data.data.defaultMeal) {
          let defaultMeal = res.data.data.defaultMeal.split(",");
          for (let i = 0; i < defaultMeal.length; i++) {
            arr.push(defaultMeal[i]);
          }
        }
        let foodCatalog = [];
        for (let i = 0; i < arr.length; i++) {
          foodCatalog.push(that.getmealTypeDataValue(arr[i]));
        }
        that.WeekInfo.foodCatalog = foodCatalog;
        that.AppendFoodType();
        if (
          that.WeekInfo.weekValue == "" ||
          that.WeekInfo.weekValue == null ||
          that.WeekInfo.weekValue == undefined
        ) {
          that.WeekInfo.weekValue = new Date();
        }
        that.FixWeek();
        that.ShowWeekSelect();
        that.SelectWeek(that.WeekInfo.weekValue);
        that.$refs.refweekSelect.hidePicker();
        that.rebuildTable();
        setTimeout(function () {
         // that.$refs.child.getFoodScore();
        }, 200);
      });
    },
    recipeNameShareSearchPub(recipeSelectPub, isRecommend) {
      if (recipeSelectPub) {
        this.recipeSelectPub = recipeSelectPub;
      } else {
        if (this.recipeSelectPub == "2") {
          isRecommend = "1";
        }
      }
      this.currentPub = 1;
      this.recipefinishedPub = false;
      this.mealListLeft = [];
      mealList(
        1,
        undefined,
        this.recipeNameSharePub,
        undefined,
        1,
        isRecommend,
        this.currentPub,
        this.sizePub
      ).then((res) => {
        this.mealListLeft = res.data.data.records;
        if (this.mealListLeft.length == res.data.data.total) {
          this.recipefinishedPub = true;
        }
      });
    },
    recipeNameShareSearchPri(recipeSelectPri, isPub) {
      //
      if (recipeSelectPri) {
        this.recipeSelectPri = recipeSelectPri;
      } else {
        if (this.recipeSelectPri == "2") {
          isPub = "0";
        }
        if (this.recipeSelectPri == "3") {
          isPub = "1";
        }
      }
      this.currentPri = 1;
      this.recipefinishedPri = false;
      this.$set(this, "peopleMealListLeft", []);
      mealList(
        2,
        isPub,
        this.recipeNameSharePri,
        undefined,
        1,
        undefined,
        this.currentPri,
        this.sizePri
      ).then((res) => {
        this.peopleMealListLeft = res.data.data.records;
        if (this.peopleMealListLeft.length == res.data.data.total) {
          this.recipefinishedPri = true;
        }
      });
    },
    mealLoad(f, name) {
      let that = this;
      if (this.WeekInfo.weekValue) {
        this.$confirm("请确定是否导入食谱：" + name + "?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }).then(() => {
          that.loading=true;
          that.inserMeal(f, that);
        });
      } else {
        this.$message({
          message: "请先选择周期",
          type: "info",
        });
      }
    },
    inserMeal(f, that) {
      detail(f.id).then((res) => {
        if (res.data.success) {
          let data = res.data.data;
          that.$set(
            that.WeekInfo,
            "foodCatalog",
            JSON.parse(data.mealTypestrs)
          );
          that.WeekInfo.weekType = data.recipeDay;
          that.FixWeek();
          that.ShowWeekSelect();
          that.SelectWeek(that.WeekInfo.weekValue);
          that.$refs.refweekSelect.hidePicker();
          that.AppendFoodType();
          let recipeCycles = data.recipeCycles;
          setTimeout(function () {
            that.insertDishesData("datas", recipeCycles, that);
            that.loading=false;
          }, 1000);
        }
      });
    },
    insertDishesData(datas, recipeCycles, that) {
      that[datas].forEach((_) => {
        _.weeks.forEach((__) => {
          let foods = [];
          for (let i = 0; i < recipeCycles.length; i++) {
            if (
              recipeCycles[i].mealsType + "" == that.getmealTypeData(_.name) &&
              recipeCycles[i].week + "" == __.name.slice(4)
            ) {
              __.image = recipeCycles[i].pic;
              let recipeConncts = recipeCycles[i].recipeConncts;
              if (recipeConncts) {
                for (let k = 0; k < recipeConncts.length; k++) {
                  //菜品
                  let food = {};
                  let recipevals = recipeConncts[k].recipevals;
                  let children = [];
                  for (let j = 0; j < recipevals.length; j++) {
                    //食材
                    let nutrientIds = [];
                    let foodNutritionList = recipevals[j].foodNutritionList;
                    if (foodNutritionList && foodNutritionList.length > 0) {
                      foodNutritionList.forEach((_) => {
                        this.nutritionValue.forEach((n) => {
                          if (n.code == _.nutrientId + "") {
                            nutrientIds.push({
                              id: _.nutrientId,
                              name: n.name,
                              value: _.value,
                            }); //数值>0即可，此时的value不准确  因为要/100*食部
                          }
                        });
                      });
                    }
                    children.push({
                      id: recipevals[j].foodId,
                      name: recipevals[j].foodName,
                      count: recipevals[j].val,
                      nutrientIds: nutrientIds,
                    });
                  }
                  food.id = recipeConncts[k].dishId;
                  food.name = recipeConncts[k].dishName;
                  food.count = recipeConncts[k].value;
                  food.children = children;
                  foods.push(food);
                }
              }
            }
          }
          that.$set(__, "foods", foods);
        });
      });
      that.$refs.child.getFoodScore();
      that.$refs.child.refreshData();
      that.jundgeFood();
      that.allergy();
    },

    //修改的时候加载
    //根据id查询菜品详情
    mealDetail(id, that) {
      that.loading=true;
      detail(id).then((res) => {
        if (res.data.success) {
          let data = res.data.data;
          that.$set(
            that.WeekInfo,
            "foodCatalog",
            JSON.parse(res.data.data.mealTypestrs)
          );
          that.WeekInfo.weekType = res.data.data.recipeDay;
          that.WeekInfo.weekValue = new Date(res.data.data.startTime);
          that.FixWeek();
          that.ShowWeekSelect();
          let recipeCycles = data.recipeCycles;
          that.SelectWeek(
            new Date(data.startTime),
            data.recipeName,
            recipeCycles
          );
          that.$refs.refweekSelect.hidePicker();
          that.WeekInfo.Weekdetails = data.recipeName;
          that.WeekInfo.crowd = data.peopleId;
          that.WeekInfo.shareTell = data.isBoard == "1" ? true : false;
          that.WeekInfo.collection = data.isUse == 1 ? true : false;
          that.WeekInfo.sharePlant = data.isPub == 0 ? true : false;
          setTimeout(function () {
            that.dishesData("datas", recipeCycles, that);
            that.$refs.child.getFoodScore();
            that.loading=false;
          }, 1000);
        }
      });
    },
    //详情数据绑定前端
    dishesData(datas, recipeCycles, that) {
      that[datas].forEach((_) => {
        _.weeks.forEach((__) => {
          let foods = __.foods;
          for (let i = 0; i < recipeCycles.length; i++) {
            if (
              recipeCycles[i].mealsType + "" == that.getmealTypeData(_.name) &&
              recipeCycles[i].week + "" == __.name.slice(4)
            ) {
              __.image = recipeCycles[i].pic;
              let recipeConncts = recipeCycles[i].recipeConncts;
              if (recipeConncts) {
                for (let k = 0; k < recipeConncts.length; k++) {
                  //菜品
                  let food = {};
                  let recipevals = recipeConncts[k].recipevals;
                  let children = [];

                  for (let j = 0; j < recipevals.length; j++) {
                    //食材
                    let nutrientIds = [];
                    let foodNutritionList = recipevals[j].foodNutritionList;
                    if (foodNutritionList && foodNutritionList.length > 0) {
                      foodNutritionList.forEach((_) => {
                        this.nutritionValue.forEach((n) => {
                          if (n.code == _.nutrientId + "") {
                            nutrientIds.push({
                              id: _.nutrientId,
                              name: n.name,
                              value: _.value,
                            }); //数值>0即可，此时的value不准确  因为要/100*食部
                          }
                        });
                      });
                    }
                    children.push({
                      id: recipevals[j].foodId,
                      name: recipevals[j].foodName,
                      count: recipevals[j].val,
                      nutrientIds: nutrientIds,
                    });
                  }
                  food.id = recipeConncts[k].dishId;
                  food.name = recipeConncts[k].dishName;
                  food.count = recipeConncts[k].value;
                  food.children = children;
                  foods.push(food);
                }
              }
            }
          }
          that.$set(__, "foods", foods);
        });
      });
      if (datas == "datas") {
        that.$refs.child.refreshData();
        that.jundgeFood();
        that.allergy();
      }
      if (datas == "showDatas") {
        //  console.log(that.showDatas)
        that.$refs.showChild.refreshData();
      }
    },
    parentFn(
      score,
      type,
      pscore,
      intake,
      nutrition,
      power,
      protein,
      meal,
      tenantName
    ) {
      if (type == "smartDatas") {
        this.peipScore = score;
        this.peippcScore = pscore;
      }
      if (type == "datas") {
        this.score = score;
        this.pcScore = pscore;
      }
      this.score = parseFloat(this.score).toFixed(2);
      this.peipScore= parseFloat(this.peipScore).toFixed(2)
      console.log(this.peipScore)
      this.tenantName = tenantName;
      this.intake = intake;
      this.nutrition = nutrition;
      this.nutrition.forEach((_) => {
        if (parseFloat(_.dris) < _.min) {
          _["red"] = true;
          _["orange"] = false;
          _["green"] = false;
        }
        if (parseFloat(_.dris) > _.max) {
          _["orange"] = true;
          _["red"] = false;
          _["green"] = false;
        }
        if (parseFloat(_.dris) >= _.min && parseFloat(_.dris) <= _.max) {
          _["green"] = true;
          _["orange"] = false;
          _["red"] = false;
        }
      });
      this.power = power;
      this.protein = protein;
      this.meal = meal;
      this.ncodeChange();
    },
    initMealData() {
      //公开
      this.recipefinishedPub = false;
      this.$set(this, "mealListLeft", []);
      mealList(
        1,
        undefined,
        undefined,
        undefined,
        1,
        undefined,
        this.currentPub,
        this.sizePub
      ).then((res) => {
        this.mealListLeft = res.data.data.records;
        if (this.mealListLeft.length == res.data.data.total) {
          this.recipefinishedPub = true;
        }
      });
      this.recipefinishedPri = false;
      this.$set(this, "peopleMealListLeft", []);
      mealList(
        2,
        undefined,
        undefined,
        undefined,
        1,
        undefined,
        this.currentPri,
        this.sizePri
      ).then((res) => {
        this.peopleMealListLeft = res.data.data.records;
        if (this.peopleMealListLeft.length == res.data.data.total) {
          this.recipefinishedPri = true;
        }
      });
    },
    dishShareSearchPub(dishSelectPub, isUse) {
      //公共
      if (dishSelectPub) {
        this.dishSelectPub = dishSelectPub;
      } else {
        if (this.dishSelectPub == "2") {
          isUse = 0;
        }
      }
      // let dishSharePub= this.dishSharePub?this.dishSharePub:undefined
      getDishByBaseId(1, 0, undefined, undefined, undefined, isUse).then(
        (res) => {
          if (res.data.success) {
            let data = [];
            res.data.data.forEach((_) => {
              let item = {};
              item["id"] = _.id;
              item["label"] = _.typeName;
              let children = [];
              _.dishes.forEach((__) => {
                let item1 = {};
                item1["id"] = __.id;
                item1["label"] = __.dishName;
                children.push(item1);
              });
              item["children"] = children;
              data.push(item);
            });
            this.menuDishList = data;
          }
        }
      );
    },
    dishShareSearchPri(dishSelectPri, typeTemp) {
      //私人
      if (dishSelectPri) {
        this.dishSelectPri = dishSelectPri;
      } else {
        if (this.dishSelectPri == "1") {
        }
        if (this.dishSelectPri == "2") {
          typeTemp = 0;
        }
        if (this.dishSelectPri == "3") {
          typeTemp = 1;
        }
      }
      let dishSharePri = this.dishSharePri ? this.dishSharePri : undefined;
      let belongRegion = this.belongRegion ? this.belongRegion[0] : undefined;
      let seasonl = this.seasonl ? this.seasonl : undefined;
      let isUse =
        (this.isUse || this.isUse == 0) && this.isUse != ""
          ? this.isUse
          : undefined;
      //
      getDishByBaseId(
        0,
        typeTemp,
        undefined,
        belongRegion,
        seasonl,
        isUse
      ).then((res) => {
        if (res.data.success) {
          let data = [];
          res.data.data.forEach((_) => {
            let item = {};
            item["id"] = _.id;
            item["label"] = _.typeName;
            let children = [];
            _.dishes.forEach((__) => {
              let item1 = {};
              item1["id"] = __.id;
              item1["label"] = __.dishName;
              children.push(item1);
            });
            item["children"] = children;
            data.push(item);
          });
          this.personMenuDishList = data;
        }
      });
    },
    initData() {
      this.initMealData();
      let that = this;
      getList().then((res) => {
        this.crowdData = res.data.data;
        this.WeekInfo.crowd = this.crowdData[0].id;
        if (that.$route.query.userid) {
          that.id = this.$route.query.userid;
          //餐点详情
          that.mealDetail(that.$route.query.userid, that);
        } else {
          that.mealsTypeById();
        }
      });
      this.dishShareSearchPub();
      this.dishShareSearchPri();

      grantTree().then((res) => {
        res.data.data.forEach((_) => {
          if (_.children) {
            _.children.forEach((__) => {
              if (__.children) {
                __.children.forEach((___) => {
                  delete __.children;
                });
              }
            });
          }
        });
        this.belongRegionOption = res.data.data;
      });
    },

    GetAbsoluteLocation(element) {
      if (arguments.length != 1 || element == null) {
        return null;
      }
      var offsetTop = element.offsetTop;
      var offsetLeft = element.offsetLeft;
      var offsetWidth = element.offsetWidth;
      var offsetHeight = element.offsetHeight;
      while ((element = element.offsetParent)) {
        offsetTop += element.offsetTop;
        offsetLeft += element.offsetLeft;
      }
      return {
        absoluteTop: offsetTop - 300,
        absoluteLeft: offsetLeft - 300,
        offsetWidth: offsetWidth + 800,
        offsetHeight: offsetHeight,
      };
    },

    MoveFoodLayer(ev) {
      var x = ev.pageX;
      var y = ev.pageY;
      this.$refs.foodmenudLayer.style.top = y + "px";
      this.$refs.foodmenudLayer.style.left = x + "px";
      this.$refs.foodmenudLayer.style.width = "180px";
      this.$refs.foodmenudLayer.style.display = "block";
    },

    ShowFood: debounce(function (ev, f) {
      this.ShowFoodTips(ev, f);
    }, 200),
    //食谱跟随显示
    ShowFoodTips(ev, f) {
      var that = this;
      this.curentHoverFood = f;
      var pose = this.GetAbsoluteLocation(ev.srcElement);
      pose.absoluteLeft += ev.srcElement.offsetWidth + 30;
      that.title = f.recipeVO.recipeName;
      that.showDatas = [];
      let day = f.recipeVO.recipeDay;
      this.day = day;
      let startTime = new Date(f.recipeVO.startTime);
      var year = startTime.getFullYear();
      var mouth = startTime.getMonth() + 1;
      var begin_day = startTime.getDate();
      that.showWeekList = [];
      that.$set(
        that.WeekInfo,
        "showFoodCatalog",
        JSON.parse(f.recipeVO.mealTypestrs)
      );
      for (let i = 1; i < day + 1; i++) {
        that.showWeekList.push({
          name: "week" + i,
          lable: "周" + that.GetChinesDay(i),
          date: mouth + "月" + begin_day + "日",
        });
        startTime = new Date(startTime.getTime() + 1000 * 60 * 60 * 24);
        var year = startTime.getFullYear();
        var mouth = startTime.getMonth() + 1;
        var begin_day = startTime.getDate();
      }
      var hd = JSON.parse(JSON.stringify(that.showWeekList));
      let header = [];
      for (let j = 0; j < hd.length; j++) {
        header.push(hd[j]);
      }
      that.showHeaders = header;
      var date3 = JSON.parse(JSON.stringify(that.WeekInfo.showFoodCatalog));
      //新增餐点类型
      for (let i = 0; i < date3.length; i++) {
        if (!that.hasShowFoodType(date3[i])) {
          var row = {
            id: that.guid(),
            pid: that.id,
            name: date3[i],
            weeks: [],
          };
          //
          // 填充周数据
          for (let j = 0; j < 7; j++) {
            row.weeks.push({
              id: that.guid(),
              week: that.showHeaders[j],
              name: "week" + (j + 1),
              image: "",
              // 填充食谱数据
              foods: [],
            });
          }
          that.showDatas.push(row);
        }
      }
      let recipeCycles = f.recipeVO.recipeCycles;
      that.dishesData("showDatas", recipeCycles, that);
      that.$refs.layershipu.style.top = "300px";
      that.$refs.layershipu.style.left = "300px";
      //
      if (that.day == 5) {
        that.$refs.layershipu.style.width = "682px";
      }
      if (that.day == 6) {
        that.$refs.layershipu.style.width = "802px";
      }
      if (that.day == 7) {
        that.$refs.layershipu.style.width = "922px";
      }
      that.$refs.layershipu.style.display = "block";
    },

    HidenFoodTips(ev) {
      this.$refs.layershipu.style.display = "none";
    },
    drop(ev) {},
    //菜谱拖动
    foodmenueDragStart(node, ev) {
      var that = this;
      ev.srcElement.addEventListener("drag", function (e) {
        that.MoveFoodLayer(e);
      });
      ev.srcElement.addEventListener("dragend", function (e) {
        that.$refs.foodmenudLayer.style.display = "none";
      });
      //
      if (node.childNodes.length == 0 && node.level != 1) {
        var that = this;
        dishDetail(node.data.id).then((res) => {
          let data = res.data.data;
          if (data.dishMxVos) {
            let children = [];
            this.nutritionValue.forEach((_) => {
              _.value = "0";
            });
            let dishCount = 0;
            data.dishMxVos.forEach((_) => {
              let item = {};
              item["id"] = _.foodId;
              item["name"] = _.name;
              item["count"] = _.value;
              dishCount += _.value;
              let nutrientIds = [];
              _.foodNutritions.forEach((__) => {
                this.nutritionValue.forEach((n) => {
                  if (n.code == __.nutrientId + "") {
                    nutrientIds.push({
                      id: __.nutrientId,
                      name: n.name,
                      value: (__.value / 100) * _.foodEat * 0.01,
                    });
                  }
                });
              });
              this.nutritionValue.forEach((n) => {
                _.foodNutritions.forEach((__) => {
                  if (n.code == __.nutrientId + "") {
                    n.value =
                      parseFloat(n.value) +
                      parseFloat((__.value / 100) * _.foodEat * 0.01 * _.value);
                  }
                });
              });
              item["nutrientIds"] = nutrientIds;
              children.push(item);
            });
            node.data = {
              id: data.id,
              label: data.dishName,
              node: {
                id: data.id,
                name: data.dishName,
                count: dishCount,
                children: children,
                dishNutrient: this.nutritionValue,
              },
            };
          }
          that.drogNode = JSON.parse(JSON.stringify(node.data));
          ev.dataTransfer.setData("Text", JSON.stringify(node.data));
          that.drogNodeStats = true;
          setTimeout(() => {
            that.$refs.child.refreshData();
            that.$refs.child.resizeExpendHeight();
          }, 100);
        });
      }
    },
    //过敏
    allergy1() {
      this.jundgeallergy = true;
      this.allergy();
    },
    allergy() {
      let recipeCycles = [];
      let that = this;
      this.datas.forEach((data) => {
        data.weeks.forEach((week) => {
          week.foods.forEach((food) => {
            let childrens = [];
            food.children.forEach((_) => {
              childrens.push({ foodId: _.id });
            });
            recipeCycles.push({
              week: week.name.slice(4),
              mealsType: this.getmealTypeData(data.name),
              dishName: food.name,
              childrens: childrens,
            });
          });
        });
      });
      let row = {
        peopleId: this.WeekInfo.crowd,
        recipeDay: this.WeekInfo.weekType,
        recipeCycles: recipeCycles,
      };
      jundgeAllergy(row).then((res) => {
        that.$set(that, "tableData", res.data.data.foods);

        that.datas.forEach((data) => {
          data.weeks.forEach((week) => {
            week.foods.forEach((dish) => {
              let flag = false;
              dish.children.forEach((food) => {
                that.$set(food, "orangeColor", false);
                for (let i = 0; i < that.tableData.length; i++) {
                  if (food.id == that.tableData[i].foodId) {
                    that.$set(food, "orangeColor", true);
                    flag = true;
                  }
                }
              });
              that.$set(dish, "orangeColor", flag);
            });
          });
        });

        console.log("this.datas", this.datas);
      });
    },
    jundgeFood() {
      let name = "";
      let row = [];
      console.log("this.datas", this.datas);
      this.datas.forEach((data) => {
        name = data.name;
        data.weeks.forEach((week) => {
          let recipeCycles = [];
          let children = [];
          week.foods.forEach((dish) => {
            dish.children.forEach((food) => {
              children.push({ foodId: food.id });
            });
          });
          if (children.length > 0) {
            recipeCycles.push({
              week: week.name.slice(4),
              mealsType: this.getmealTypeData(name),
              childrens: children,
            });
            row.push({
              peopleId: this.WeekInfo.crowd,
              recipeDay: this.WeekInfo.weekType,
              recipeCycles: recipeCycles,
            });
          }
        });
      });
      let that = this;
      //食材相克
      jundgeFood(row).then((result) => {
        //
        debugger;
        let foodMutuals = [];
        let msg = "";
        if (result.data.data.foodMutuals.length > 0) {
          for (let i = 0; i < result.data.data.foodMutuals.length; i++) {
            foodMutuals.push({
              mealType: result.data.data.foodMutuals[i].mealType,
              week: result.data.data.foodMutuals[i].week,
              foodId: result.data.data.foodMutuals[i].foodId,
              foodId1: result.data.data.foodMutuals[i].foodId1,
              msg: result.data.data.msg[i],
            });
            msg += result.data.data.msg[i] + "，";
          }
          that.foodMutuals = foodMutuals;

          this.$message.warning(msg.substring(0, msg.length - 1));
        } else {
          that.foodMutuals = [];
        }
        that.datas.forEach((data) => {
          // if (data.id === id) {
          data.weeks.forEach((week) => {
            // if (week.name === wk) {
            week.foods.forEach((dish) => {
              let flag = false;
              dish.children.forEach((food) => {
                that.$set(food, "redColor", false);
                for (let i = 0; i < that.foodMutuals.length; i++) {
                  debugger;
                  if (
                    food.id == that.foodMutuals[i].foodId &&
                    that.foodMutuals[i].mealType + "" ==
                      this.getmealTypeData(data.name) &&
                    "week" + that.foodMutuals[i].week == week.name
                  ) {
                    that.$set(food, "redColor", true);
                    flag = true;
                  }
                  if (
                    food.id == that.foodMutuals[i].foodId1 &&
                    that.foodMutuals[i].mealType + "" ==
                      this.getmealTypeData(data.name) &&
                    "week" + that.foodMutuals[i].week == week.name
                  ) {
                    that.$set(food, "redColor", true);
                    flag = true;
                  }
                }
              });
              that.$set(dish, "redColor", flag);
            });
            // }
          });
          //  }
        });
      });
    },
    foodmenueDragEnd(a, b, c) {
      this.drogNodeStats = false;
      this.$refs.foodmenudLayer.style.display = "none";

      return false;
    },
    tfractio() {
      this.drawer = true;
    },
    ncodeChange() {
      let that = this;
      this.nutrition.forEach((_) => {
        if (_.code == that.node.nowCode) {
          that.$set(that.node, "nowValue", _.dris);
        }
      });
      this.node.exceptValue = undefined;
    },
    startTrim() {
      if (this.node.exceptValue) {
        let that = this;

        this.smartDatas.forEach((week) => {
          week.weeks.forEach((_) => {
            _.foods.forEach((__) => {
              __.children.forEach((___) => {
                let flag = false;
                ___.nutrientIds.forEach((n) => {
                  if (n.id == that.node.nowCode) {
                    if (n.value != "0") {
                      flag = true;
                    }
                  }
                });
                if (flag) {
                  let add =
                    (parseFloat(that.node.exceptValue) -
                      parseFloat(that.node.nowValue)) /
                    parseFloat(that.node.nowValue);
                  if (add > 0) {
                    this.$set(___, "up", (add * parseFloat(100)).toFixed(2));
                    delete ___["down"];
                  } else if (add < 0) {
                    this.$set(
                      ___,
                      "down",
                      Math.abs((add * parseFloat(100)).toFixed(2))
                    );
                    delete ___["up"];
                  } else {
                    delete ___["down"];
                    delete ___["up"];
                  }
                  let count =
                    parseFloat(___.count) + parseFloat(___.count) * add;
                  this.$set(___, "count", count.toFixed(2));
                } else {
                  //
                  Vue.delete(___, "down");
                  Vue.delete(___, "up");
                  // delete ___["down"]
                  // delete ___["up"]
                  // this.$set(___, "count", ___.count);
                }
              });
            });
          });
        });
        this.smartDatas.forEach((item) => {
          this.$set(item, "flag", true);
          item.weeks.forEach((_) => {
            _.foods.forEach((__) => {
              let count = 0;
              __.children.forEach((___) => {
                count += parseFloat(___.count ? ___.count : 0);
              });
              if (parseFloat(__.count) > parseFloat(count)) {
                //下降
                this.$set(
                  __,
                  "down",
                  Math.abs(
                    (
                      ((parseFloat(count) - parseFloat(__.count)) /
                        parseFloat(__.count)) *
                      100
                    ).toFixed(2)
                  )
                );
                delete __["up"];
              } else if (parseFloat(__.count) < parseFloat(count)) {
                //上升
                this.$set(
                  __,
                  "up",
                  (
                    ((parseFloat(count) - parseFloat(__.count)) /
                      parseFloat(__.count)) *
                    100
                  ).toFixed(2)
                );
                delete __["down"];
              } else {
                delete __["down"];
                delete __["up"];
              }
              this.$set(__, "count", count.toFixed(2));
            });
          });
        });

        this.$refs.child2.getFoodScoreSmart();
      } else {
        this.$message({
          message: "期望值不可为空",
          type: "info",
        });
      }
    },
    application() {
      this.smartDatas.forEach((week) => {
        delete week["flag"];
        week.weeks.forEach((_) => {
          _.foods.forEach((__) => {
            __.children.forEach((___) => {
              delete ___["down"];
              delete ___["up"];
            });
            delete __["down"];
            delete __["up"];
          });
        });
      });
      localStorage.setItem("smartDatas", JSON.stringify(this.smartDatas));
      this.datas = JSON.parse(localStorage.getItem("smartDatas"));
      this.pointscan = false;
      let that = this;
      setTimeout(function () {
        that.$refs.child.getFoodScore();
      }, 200);

      this.$refs.child.refreshData();
    },
    resetMeals() {
      this.smartDatas = JSON.parse(localStorage.getItem("mealsDatas"));
      let that = this;
      setTimeout(function () {
        that.$refs.child2.getFoodScoreSmart();
      }, 200);
    },
    //清空菜品
    dishClear() {
      this.datas.forEach((_) => {
        _.weeks.forEach((week) => {
          this.$set(week, "foods", []);
          this.$set(week, "image", "");
        });
      });
      this.$refs.child.resizeExpendHeight();
    },
    //智能配平
    wrapscan() {
      this.ncodeChange();
      localStorage.setItem("mealsDatas", JSON.stringify(this.datas));
      this.smartDatas = JSON.parse(localStorage.getItem("mealsDatas"));
      this.pointscan = true;
      this.peipScore = this.score;
      //console.log("this.smartDatas", this.smartDatas)
    },
    getmealTypeData(name) {
      //
      return this.mealTypeData.filter((_) => {
        if (_.name == name) {
          return _.value;
        }
      })[0].value;
    },
    getmealTypeDataValue(value) {
      return this.mealTypeData.filter((_) => {
        if (_.value == value) {
          return _.value;
        }
      })[0].name;
    },
    //保存食谱
    buttonend() {
      let recipeCycles = [];
      let flag = false;
      this.datas.forEach((_) => {
        _.weeks.forEach((__) => {
          __.foods.forEach((___) => {
            if (___.children) {
              let children = [];
              ___.children.forEach((____) => {
                if (!____.count && parseFloat(____.count) != 0) {
                  flag = true;
                }
                children.push({
                  foodId: ____.id,
                  val: ____.count,
                });
              });
              if (!___.count && parseFloat(___.count) != 0) {
                flag = true;
              }
              recipeCycles.push({
                week: __.name.slice(4),
                mealsType: this.getmealTypeData(_.name),
                dishId: ___.id,
                value: ___.count,
                year: this.year,
                month: __.week.date,
                childrens: children,
                pic: __.image,
              });
            }
          });
        });
      });

      let row = {
        mealTypestrs: JSON.stringify(this.WeekInfo.foodCatalog),
        recipeName: this.WeekInfo.Weekdetails,
        peopleId: this.WeekInfo.crowd,
        isPub: this.WeekInfo.sharePlant ? 0 : 1,
        recipeDay: this.WeekInfo.weekType,
        recipeCycles: recipeCycles,
        isUse: this.WeekInfo.collection ? 1 : 0,
        recipeCategory: 1,
        startTime: formateDate(this.startTime, "yyyy-MM-dd HH:mm:ss"),
        endTime: formateDate(this.endTime, "yyyy-MM-dd HH:mm:ss"),
        isBoard: this.WeekInfo.shareTell ? 1 : 0,
        score: this.score,
      };
      if (
        row.recipeName &&
        row.recipeCycles.length > 0 &&
        row.startTime &&
        !flag
      ) {
        if (this.id) {
          row["id"] = this.id;
          update(row).then((res) => {
            if (res.data.success) {
              this.$message({
                type: "success",
                message: "编辑成功!",
              });
              this.initMealData();
              this.$router.$avueRouter.closeTag();
              this.$router.push({
                path: "./myecipe",
              });
            }
          });
        } else {
          save(row).then((res) => {
            if (res.data.success) {
              this.$message({
                type: "success",
                message: "新增成功!",
              });
              this.initMealData();
              this.$router.$avueRouter.closeTag();
              this.$router.push({
                path: "/message/myecipe",
              });
            }
          });
        }
      } else {
        this.$message({
          type: "info",
          message: "存在空值，无法保存!",
        });
      }
    },
    init() {
      this.initRemoteData();
    },
    //重新构建表格
    rebuildTable() {
      var that = this;
      this.headers = [];
      setTimeout(function () {
        //
        var hd = JSON.parse(JSON.stringify(that.WeekList));
        for (let j = 0; j < hd.length; j++) {
          that.headers.push(hd[j]);
        }
        that.initEmptyData();
      }, 100);
    },

    //餐点类型改变
    AppendFoodType() {
      let mealsType = [];
      let that = this;
      this.mealTypeData.forEach((_) => {
        if (JSON.stringify(this.WeekInfo.foodCatalog).indexOf(_.name) != -1) {
          mealsType.push(_.name);
        }
      });
      this.WeekInfo.foodCatalog = mealsType;
      var date3 = JSON.parse(JSON.stringify(this.WeekInfo.foodCatalog));
      let datas = this.datas;
      let res = [];
      //新增餐点类型

      for (let i = 0; i < date3.length; i++) {
        //
        if (!this.hasFoodType(date3[i])) {
          var row = {
            id: this.guid(),
            pid: this.id,
            name: date3[i],
            weeks: [],
          };
          // 填充周数据
          for (let j = 0; j < 7; j++) {
            row.weeks.push({
              id: this.guid(),
              week: this.headers[j],
              name: "week" + (j + 1),
              image: "",
              // 填充食谱数据
              foods: [],
            });
          }
          datas.push(row);
        }
      }
      this.mealTypeData.forEach((_) => {
        for (let i = 0; i < datas.length; i++) {
          if (_.name == datas[i].name) {
            res.push(datas[i]);
          }
        }
      });
      this.datas = res;
      //删除餐点类型
      var deleteList = [];
      for (let i = 0; i < this.datas.length; i++) {
        var needremove = true;
        this.WeekInfo.foodCatalog.forEach((e) => {
          if (e == this.datas[i].name) {
            needremove = false;
          }
        });
        if (needremove) {
          deleteList.push(i);
        }
      }
      deleteList.forEach((e) => {
        this.datas.splice(e, 1);
      });
      setTimeout(function () {
        // that.$refs.child.getFoodScore();
        that.$refs.child.refreshData();
        that.$refs.child.resizeExpendHeight();
      }, 200);
    },

    hasFoodType(foodTypeName) {
      var result = this.datas.find((p) => p.name == foodTypeName);
      if (!result) {
        return false;
      } else {
        return true;
      }
    },
    hasShowFoodType(foodTypeName) {
      var result = this.showDatas.find((p) => p.name == foodTypeName);
      if (!result) {
        return false;
      } else {
        return true;
      }
    },
    // 初始化表格数据(根据id获取远程数据)
    initEmptyData() {
      //
      this.datas = [];
      var date3 = JSON.parse(JSON.stringify(this.WeekInfo.foodCatalog));
      for (let i = 0; i < date3.length; i++) {
        var row = {
          id: this.guid(),
          pid: this.id,
          name: date3[i],
          weeks: [],
        };
        // 填充周数据
        for (let j = 0; j < 7; j++) {
          row.weeks.push({
            id: this.guid(),
            week: this.headers[j],
            name: "week" + (j + 1),
            image: "",
            // 填充食谱数据
            foods: [],
          });
        }
        this.datas.push(row);
      }
    },

    ///初始化远程数据
    initRemoteData() {
      var remoteStr =
        // '[{"id":"7317b146-7fc5-fcbd-2969-5b59f321e831","name":"早餐","weeks":[{"id":"79ba0527-a10a-22e0-2df4-b58d9c8b1191","week":{"name":"week1","lable":"周一","date":"11月2日","is_vacation":false},"name":"week1","image":"","foods":[{"id":101,"name":"绿豆粥","count":1,"children":[{"id":101001,"name":"绿豆","count":1,"spans":3},{"id":101002,"name":"白糖","count":1,"spans":3}],"spans":3}]},{"id":"880061e2-66d2-fed1-11bc-b9b2489fc0af","week":{"name":"week2","lable":"周二","date":"11月3日","is_vacation":false},"name":"week2","image":"","foods":[]},{"id":"ee2c62a0-5d95-9d34-0df3-212081347a45","week":{"name":"week3","lable":"周三","date":"11月4日","is_vacation":false},"name":"week3","image":"","foods":[]},{"id":"7383fe68-8ec8-e72b-879d-d99805c9813f","week":{"name":"week4","lable":"周四","date":"11月5日","is_vacation":false},"name":"week4","image":"","foods":[]},{"id":"148b984c-76f5-b856-3965-6925b0f1e694","week":{"name":"week5","lable":"周五","date":"11月6日","is_vacation":false},"name":"week5","image":"","foods":[]},{"id":"2b524e1a-4b03-d446-f09e-597a4afce450","name":"week6","image":"","foods":[]},{"id":"8eac338a-acda-78c2-e837-bae237cad7ea","name":"week7","image":"","foods":[]}]}]';
        '[{"id":"7317b146-7fc5-fcbd-2969-5b59f321e831","name":"早餐","weeks":[{"id":"79ba0527-a10a-22e0-2df4-b58d9c8b1191","week":{"name":"week1","lable":"周一","date":"11月2日","is_vacation":false},"name":"week1","image":"","foods":[{"id":101,"name":"绿豆粥","count":1,"children":[{"id":101001,"name":"绿豆","count":1,"spans":3},{"id":101002,"name":"白糖","count":1,"spans":3}],"spans":3}]},{"id":"880061e2-66d2-fed1-11bc-b9b2489fc0af","week":{"name":"week2","lable":"周二","date":"11月3日","is_vacation":false},"name":"week2","image":"","foods":[]},{"id":"ee2c62a0-5d95-9d34-0df3-212081347a45","week":{"name":"week3","lable":"周三","date":"11月4日","is_vacation":false},"name":"week3","image":"","foods":[]},{"id":"7383fe68-8ec8-e72b-879d-d99805c9813f","week":{"name":"week4","lable":"周四","date":"11月5日","is_vacation":false},"name":"week4","image":"","foods":[]},{"id":"148b984c-76f5-b856-3965-6925b0f1e694","week":{"name":"week5","lable":"周五","date":"11月6日","is_vacation":false},"name":"week5","image":"","foods":[]},{"id":"2b524e1a-4b03-d446-f09e-597a4afce450","name":"week6","image":"","foods":[]},{"id":"8eac338a-acda-78c2-e837-bae237cad7ea","name":"week7","image":"","foods":[]}]}]';
      var remoteData = JSON.parse(remoteStr);
      this.headers = [];
      remoteData[0].weeks.forEach((e) => {
        if (e.week) {
          this.headers.push(e.week);
        }
      });
      this.datas = remoteData;
    },
    //生成随机 GUID 数
    guid() {
      function S4() {
        return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
      }

      return (
        S4() +
        S4() +
        "-" +
        S4() +
        "-" +
        S4() +
        "-" +
        S4() +
        "-" +
        S4() +
        S4() +
        S4()
      );
    },
    //周选择添加周次
    FixWeek() {
      var weekSelect = document.getElementsByName("WeekSelect");
      if (weekSelect == undefined) return;

      if (weekSelect[0].getAttribute("isFixWeek") != undefined) return;

      setTimeout(function () {
        var zs = document.createElement("th");
        zs.innerText = "周次";
        var RootweekFirst = document.querySelector(
          ".el-picker-panel__content table tr th"
        );
        var Rootweek = document.querySelector(".el-picker-panel__content tr");
        Rootweek.insertBefore(zs, RootweekFirst);
        var listRow = document.querySelectorAll(".el-date-table__row");

        for (var i = 0; i < listRow.length; i++) {
          var firstNode = listRow[i].children[0];
          var zs_index = document.createElement("td");
          zs_index.style.fontWeight = "bold";
          zs_index.style.color = "#fe6c6f";
          var z = i + 1;
          switch (z) {
            case 1:
              zs_index.innerText = "一";
              break;
            case 2:
              zs_index.innerText = "二";
              break;
            case 3:
              zs_index.innerText = "三";
              break;
            case 4:
              zs_index.innerText = "四";
              break;
            case 5:
              zs_index.innerText = "五";
              break;
            case 6:
              zs_index.innerText = "六";
              break;
          }

          listRow[i].insertBefore(zs_index, firstNode);
        }
        document
          .getElementsByName("WeekSelect")[0]
          .setAttribute("isFixWeek", "true");
      }, 100);
    },
    GetChinesDay(z) {
      var cday = "";
      switch (z) {
        case 1:
          cday = "一";
          break;
        case 2:
          cday = "二";
          break;
        case 3:
          cday = "三";
          break;
        case 4:
          cday = "四";
          break;
        case 5:
          cday = "五";
          break;
        case 6:
          cday = "六";
          break;
        case 7:
          cday = "天";
          break;
      }

      return cday;
    },
    selectWeekType() {
      let that = this;
      let weekType = that.WeekInfo.weekType;
      that.$refs.refweekSelect.showPicker();
      that.SelectWeek(this.startTime);
      that.$refs.refweekSelect.hidePicker();
    },
    SelectWeek1(d) {
      this.SelectWeek(d);
      // this.$confirm("重新选择周期会清空已有菜品", "提示", {
      //   confirmButtonText: "确定",
      //   cancelButtonText: "取消",
      //   type: "warning"
      // }).then(()=>{
      //
      // })
    },
    //选择周
    SelectWeek(d, name, recipeCycles) {
      if (typeof d == "string") {
        d = new Date(d);
      }
      var that = this;
      setTimeout(function (v) {
        var year = d.getFullYear();
        that.year = year;
        var begin_year;
        var end_year;
        begin_year = year;
        end_year = year;
        var begin_mouth;
        var end_mouth;
        var mouth = d.getMonth() + 1;

        begin_mouth = mouth;
        end_mouth = mouth;
        var StartEliment = document.querySelectorAll(".in-range.start-date");

        var begin_day = StartEliment[0].innerText.trim();
        that.month = begin_mouth + "-" + begin_day + "";
        //判断是否为上一个月
        if (StartEliment[0].className.indexOf("prev-month") >= 0) {
          begin_mouth = mouth - 1;
          if (begin_mouth == 0) {
            begin_mouth = 12;
          }
        }

        //判断是否为下一个月
        var endtime = document.querySelectorAll(".in-range.end-date");
        if (endtime[0].className.indexOf("next-month") >= 0) {
          if (mouth == 12) {
            end_year = end_year + 1;
            end_mouth = 1;
          }
        }
        var end_day = endtime[0].innerText.trim();

        //获取周数本月

        //获取周数
        var curentWeek = document.querySelectorAll(
          ".el-date-table__row.current"
        )[0].firstChild.innerText;

        var full_week = year + "年" + mouth + "月" + "第" + curentWeek + "周";

        that.WeekInfo.WeekTtitle = full_week;
        if (parseInt(begin_day) > parseInt(end_day)) {
          end_mouth = begin_mouth + 1;
          if (end_mouth > 12) {
            end_mouth = 1;
          }
        }
        var full_weekDetails =
          year +
          "年" +
          mouth +
          "月" +
          "第" +
          curentWeek +
          "周" +
          // begin_year +
          // "-" +
          begin_mouth +
          "-" +
          begin_day +
          "至" +
          // end_year +
          // "-" +
          end_mouth +
          "-" +
          end_day;

        if (name) {
          that.WeekInfo.Weekdetails = name;
        } else {
          that.WeekInfo.Weekdetails = full_weekDetails;
        }
        that.startTime = new Date(year + "-" + begin_mouth + "-" + begin_day);
        that.startTimeStr = year + "-" + begin_mouth + "-" + begin_day;
        that.endTime = new Date(end_year + "-" + end_mouth + "-" + end_day);
        that.endTimeStr = end_year + "-" + end_mouth + "-" + end_day;
        //获取每天
        that.WeekList = [];

        var alldday = document.querySelectorAll(
          ".el-date-table__row.current"
        )[0].children;

        for (let i = 1; i < alldday.length; i++) {
          if (i <= that.WeekInfo.weekType) {
            var y = year;
            var m = mouth;
            if (alldday[i].className.indexOf("prev-month") >= 0) {
              m = mouth - 1;
              if (m == 0) {
                m = 12;
              }
            }

            if (alldday[i].className.indexOf("next-month") >= 0) {
              if (mouth == 12) {
                y = year + 1;
                m = 1;
              }
            }

            that.WeekList.push({
              name: "week" + i,
              lable: "周" + that.GetChinesDay(i),
              date: m + "月" + alldday[i].innerText.trim() + "日",
              is_vacation: false,
            });
          }
        }
        that.rebuildTable();
      }, 100);
    },
    //打开周选择
    ShowWeekSelect() {
      this.$refs.refweekSelect.showPicker();
    },
  },
};
</script>

<style>
.meals .el-drawer__open .el-drawer.rtl {
  width: 50% !important;
  overflow-y: scroll;
}
</style>


<style scoped>
.judegRed{
  background-color:red;
  border-color:red;
}
.judegRed:focus, .judegRed:hover{
  background-color: #e35656;
  border-color:#e35656;
}
.item-allergy {
  min-height: 100px;
  max-height: 250px;
  overflow: scroll;
}

.meals .el-row {
  padding: 5px;
}

/*.meals .el-select .el-input {*/
/*width: 120px;*/
/*}*/
.meals .el-form-item {
  margin-bottom: 0px;
  margin-right: 20px;
}

.meals .el-divider {
  margin: 0px !important;
}

.meals .clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.meals .clearfix:after {
  clear: both;
}

.meals .box-car {
  border: 1px solid #ebebeb !important;
  border-radius: 3px !important;
  padding: 0px;
  height: calc(100vh - 324px);
}
.meals .box-car1 {
  border: 1px solid #ebebeb !important;
  border-radius: 3px !important;
  padding: 0px;
  height: calc(100vh - 220px);
}

.meals .el-card__body {
  padding: 0px !important;
}

.meals .panel_head {
  background-color: rgba(0, 172, 160, 1);
  padding-top: 10px;
  text-align: center;
  border-radius: 3px;
}

.meals .panel_head button {
  border-bottom: 0px;
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  margin-bottom: 1px;
}

.meals .foodWeekListHis {
  padding: 0 0 0 10px;
  overflow-y: scroll;
}

.meals .foodWeekListHis1 {
  height: calc(100vh - 400px);
}
.meals .foodWeekListHis2 {
  height: calc(100vh - 500px);
}

.meals .foodWeekListHis li {
  list-style: none;
  margin-bottom: 5px;
  height: 30px;
  font-size: 10px !important;
}

.meals .foodWeekListHis li span {
  max-width: 165px;
  min-width: 130px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  float: left;
}

.meals .foodWeekListHis li img {
  float: right;
}

.meals .foodPanel {
  /* height: calc(100vh - 180px);
  overflow-y: scroll;
  overflow-x: auto; */
}

.meals .foodrate {
  width: 100%;
  height: 50px;
  /* background-color: red; */
  text-align: center;
  margin-bottom: 50px;
}

.scores {
  cursor: pointer;
  width: 230px;
  height: 102px;
  /* background-color: red; */
  position: absolute;
  top: 70px;
  right: 50px;
  z-index: 999;
}

.scores3 {
  width: 130px;
}

.scores-same {
  width: 230px;
  height: 108px;
  color: #ffffff;
  background-size: 100% 100%;
  display: flex;
  justify-content: space-between;
}

.scores-youxiu {
  /* background-color: yellow; */
  background-image: url("/img/youxiu.png");
}

.scores-buhege {
  background-image: url("/img/buhege.png");
}

.scores-hege {
  background-image: url("/img/hege.png");
}

.scores2 {
  width: 120px;
  height: 65px;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  /* background-color: blue; */
  background-size: 100% 100%;
}

.gnus {
  font-size: 20px;
  text-align: center;
  font-weight: 600;
  margin-top: 35px;
}

.gnus-fen {
  color: #ffffff;
  font-size: 10px;
  font-weight: 600;
}

.gnus-hege {
  font-size: 20px;
  font-weight: 600;
}

.meals .header {
  width: 100%;
  height: 120px;
  /* background-color: red; */
}

.headerTime {
  width: 100%;
  height: 55px;
}

.meals .nutrition {
  width: 100%;
  height: 55px;
  /* background-color: blue; */
}

.meals .action {
  width: 23%;
  height: 700px;
  /* background: yellow; */
  float: left;
}

.onblur {
  width: 100%;
  display: flex;
  justify-content: start;
  height: 700px;
  /* background-color: red; */
  float: left;
  margin-top: 20px;
  margin-left: 15px;
  margin-bottom: 70px;
}

.meals .arrow {
  width: 100%;
  height: 50px;
  line-height: 50px;
  /* background-color: blue; */
  display: flex;
}

.meals .season {
  width: 80px;
  height: 30px;
  text-align: center;
  color: #fff;
  line-height: 30px;
  margin-top: 10px;
  background-color: rgba(255, 0, 0, 1);
}

.meals .season1 {
  width: 80px;
  height: 30px;
  margin-left: 20px;
  text-align: center;
  color: #fff;
  line-height: 30px;
  margin-top: 10px;
  background-color: rgba(0, 172, 160, 1);
}

.meals .season2 {
  width: 80px;
  height: 30px;
  margin-left: 20px;
  text-align: center;
  color: #fff;
  line-height: 30px;
  margin-top: 10px;
  background-color: rgba(255, 153, 51, 1);
}

.meals .fonts {
  width: 100%;
  /* height: 500px; */
  /* background-color: yellow; */
}

.meals .el-checkbox {
  margin-right: 10px;
}

.select-item {
  margin-top: 5px;
  display: flex;
  justify-content: space-between;
  font-size: 12px !important;
}

.meals .el-input {
  font-size: 12px !important;
}

/*.meals .select-item .el-input__icon{*/
/*width:5px !important;*/
/*}*/
/*.meals .select-item  .el-input--suffix .el-input__inner{*/
/*padding-right: 15px!important;*/
/*}*/

.showFoodListColor {
  color: #00b1a2 !important;
  border-color: #b3e8e3 !important;
  background-color: #e6f7f6 !important;
}

.recipeColor {
  color: #00b1a2 !important;
}

.dishColor {
  color: #00b1a2 !important;
}

.filter-tree {
  font-size: 14px;
  margin-left: 5px;
  margin-top: 15px;
  overflow-y: scroll;
  height: 450px;
}

.detetion-box {
  height: inherit;
  overflow: scroll;
}

/*.crow-item{*/
/*width:100px;*/
/*}*/
</style>
